
import React from "react";
import img3 from "../cll/imgs/1.png"
import { Card, NavBar, Steps, Button, Switch, Space, Modal, Toast } from 'antd-mobile';
import { useNavigate } from "react-router-dom"
import {  RightOutline } from 'antd-mobile-icons'

import "./shezhi.css"
function Shezhi() {

    const navigate = useNavigate()
    const back = () => {
        navigate(-1)
    }
    return (
        <div className="box">
            <div className="she">
                <div>
                    <img src={img3} alt="" srcset="" className="img3" />
                </div>
                <NavBar onBack={back}>
                    <span>设置</span>
                </NavBar>


            </div>
            <div style={{ marginTop: 20 }}>
                <div>
                    <Card
                        title={
                            <div style={{ fontWeight: 'normal' }}>

                                <span>账户与安全</span>
                            </div>
                        }
                        extra={<span><RightOutline /></span>}
                        style={{ borderRadius: '5px', marginTop: 5, height: 50, lineHeight: 2 }}
                    >
                    </Card>
                    <Card
                        title={
                            <div style={{ fontWeight: 'normal' }}>

                                <span>推送设置</span>
                            </div>
                        }
                        extra={<span> <Switch
                            defaultChecked
                            style={{
                                '--checked-color': '#00b578',
                                '--height': '30px',
                                '--width': '60px',
                            }}
                        /></span>}

                        style={{ borderRadius: '5px', marginTop: 5, height: 50, lineHeight: 2 }}
                    >
                    </Card>
                </div>
                <div style={{ marginTop: 20 }}>
                    <Card
                        title={
                            <div style={{ fontWeight: 'normal' }}>

                                <span>下载二维码</span>
                            </div>
                        }
                        extra={<span><RightOutline /></span>}
                        style={{ borderRadius: '5px', marginTop: 5, height: 50, lineHeight: 2 }}
                    >
                    </Card>
                    <Card
                        title={
                            <div style={{ fontWeight: 'normal' }}>

                                <span>检查更新</span>
                            </div>
                        }
                        extra={<span><span style={{ color: "rgb(138, 138, 138)" }}>v2.0.0</span><RightOutline /></span>}


                        style={{ borderRadius: '5px', marginTop: 5, height: 50, lineHeight: 2 }}
                    >
                    </Card>
                    <Card
                        title={
                            <div style={{ fontWeight: 'normal' }}>

                                <span>给我好评</span>
                            </div>
                        }
                        extra={<span><RightOutline /></span>}


                        style={{ borderRadius: '5px', marginTop: 5, height: 50, lineHeight: 2 }}
                    >
                    </Card>
                </div>

                <div style={{ marginTop: 30 }}>
                    <Card
                        title={
                            <div style={{ fontWeight: 'normal' }}>

                                <span>帮忙与反馈</span>
                            </div>
                        }
                        extra={<span><RightOutline /></span>}


                        style={{ borderRadius: '5px', marginTop: 5, height: 50, lineHeight: 2 }}
                    >
                    </Card>
                    <Card
                        title={
                            <div style={{ fontWeight: 'normal' }}>

                                <span>关于我们</span>
                            </div>
                        }
                        extra={<span><RightOutline /></span>}


                        style={{ borderRadius: '5px', marginTop: 5, height: 50, lineHeight: 2 }}
                    >
                    </Card>
                    <Card
                        title={
                            <div style={{ fontWeight: 'normal' }}>

                                <span>服务条款</span>
                            </div>
                        }
                        extra={<span><RightOutline /></span>}


                        style={{ borderRadius: '5px', marginTop: 5, height: 50, lineHeight: 2 }}
                    >
                    </Card>
                    <Card
                        title={
                            <div style={{ fontWeight: 'normal' }}>

                                <span>客服热线</span>
                            </div>
                        }
                        extra={<span><span style={{ color: "rgb(138, 138, 138)" }}>400-801-3382</span></span>}


                        style={{ borderRadius: '5px', marginTop: 5, height: 50, lineHeight: 2 }}
                    >
                    </Card>
                </div>
            </div>
            <div className="tui">

                <Space direction='vertical' block>
                    <Button
                        block
                        color='warning'
                        onClick={() =>
                            Modal.confirm({
                                content: '确定退出吗？',
                                onConfirm: async () => {
                                    Toast.show({
                                        icon: 'success',
                                        content: '退出成功',
                                        position: 'bottom',
                                        afterClose:()=>{
                                            navigate("/login")
                                        }
                                    })

                                },
                            })
                        }
                    >
                        退出账户
                    </Button>
                </Space>
            </div>

        </div>
    )
}

export default Shezhi